<template>
  <div class="pay">
    <van-cell is-link  @click="goaddress" class="pay-container">
      <div class="tag">
        <p>默认</p>
      </div>
      <div class="address">
        <p>
          <span>{{ address.address }}</span>
          <span>{{ address.address_detail }}</span>
        </p>
        <p>
          <span>{{ address.name }}</span>
          <span>{{ address.mobile }}</span>
        </p>
      </div>
    </van-cell>
    <van-card
    v-for="item in goodsList" :key="item.id"
      :num="item.number"
      :price="item.retail_price"
      :desc="item.goods_name"
      :thumb="item.list_pic_url"
    />
    <div>
        <p>商品合计:{{allPrise}}</p>
        <p>运费</p>
        <p>优惠劵</p>
    </div>
    <div>
        实付:{{ all }}
        <button @click="gopay">支付</button>
    </div>
  </div>
</template>

<script>
import { cartdetailAction } from "@/axios/index";

export default {
  name: "pay",

  data() {
    return {
      address: {},
      goodsList: [],
      allPrise:'',
    };
  },
  computed:{
    all(){
            return this.allPrise
    }
  },
  async mounted() {
    let res = await cartdetailAction({
      openId: localStorage.getItem("openId"),
    });
    console.log(res);
    this.address = res.address;
    this.goodsList = res.goodsList;
    this.allPrise=res.allPrise
  },

  methods: {
    goaddress(){
        this.$router.push({name:'addressPage'})
    },
    gopay(){
        alert("暂时不支持")
    }
  },
};
</script>

<style scoped lang="scss">
.pay {
  .pay-container {
    display: flex;
    flex-wrap: nowrap;
    .tag {
      width: 10%;
    }
    .address {
      width: 50%;
    }
  }
}
</style>